@import "../themes/button";
@import "../mixins/compatible";
@mixin button($bg:$button-default, $color:$button-text, $border:darken($bg, 6%)){
    display: inline-block;
    background-color: $bg;
    color: $color;
    border-radius: $button-border-radius;
    border: 1px solid $border;
    cursor: pointer;
    height: $button-default-height;
    line-height: $button-default-height - 2;
    padding: 0 $button-default-padding-LR;
    font-size: $button-default-font-size;
    text-decoration: none;
    .#{$css-prefix}icon-right,
    .#{$css-prefix}icon{
        font-size: $button-default-font-size;
    }
    .#{$css-prefix}icon{
        padding-right: 5px;
    }
    .#{$css-prefix}icon-right{
        padding-left: 5px;
    }
    font-weight: 300;
    @include transition(all .5s);
    transition-property: background-color,color,border-color,outline-color;
    &:hover:not([class*='disable']):not([class*='hollow']){
        background-color: darken($bg, 10%);
        border-color: darken($border, 10%)
    }
    [class*='icon']{
        padding-right: 3px;
        float: left;
    }
}

@mixin button-size($height:$button-default-height, $font-size:$button-default-font-size, $paddingLR:$button-default-padding-LR){
    height: $height;
    line-height: $height - 2;
    padding: 0 $paddingLR;
    font-size: $font-size;
    .#{$css-prefix}icon-right,
    .#{$css-prefix}icon{
        font-size: $font-size;
    }

}